<template>
  <div>
    <el-form
      label-width="80px"
      size="mini"
      label-position="right"
      @submit.native.prevent
    >
      <filter-box :item-width="330">
        <el-form-item label="工单状态">
          <el-select
            class="filter-item"
            v-model="queryParams.flowStatus"
            :clearable="true"
            placeholder="工单状态"
          >
            <el-option
              v-for="item in SysFlowWorkOrderStatus.getList()"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="创建日期">
          <date-range
            class="filter-item"
            v-model="queryParams.time"
            :clearable="true"
            :allowTypes="['day']"
            align="left"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd HH:mm:ss"
          />
        </el-form-item>
        <el-button
          slot="operator"
          type="primary"
          :plain="true"
          size="mini"
          :disabled="btnLoading"
          @click="handleClickSearch"
        >
          查询
        </el-button>
        <el-button
          slot="operator"
          type="primary"
          size="mini"
          :disabled="btnLoading"
          @click="handleClickAdd"
        >
          新建
        </el-button>
      </filter-box>
    </el-form>
  </div>
</template>
<script>
export default {
  data () {
    return {
      createTime: [],
      flowStatus: undefined
    }
  },
  props: {
    btnLoading: {
      type: Boolean,
      default: false
    },
    queryParams: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  methods: {
    handleClickSearch () {
      this.$emit('handleSearch')
    },
    handleClickAdd () {
      this.$emit('handleAdd')
    }
  }
}
</script>
